.body {
  height: 100%;
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;

  @for $i from 1 through 7 {
    & > .loading#{$i} {
      display: inline-flex;
      margin-left: 16px;
      color: rgba(random(255), random(255), random(255), 0.8);
      font-size: 36px;
      animation: debounce_self_height 2s ease-in-out 0.1s * $i infinite both;
    }
  }
}

@keyframes debounce_self_height {
  0% {
    transform: translateY(0px);
  }

  50% {
    transform: translateY(-0px);
  }

  70% {
    transform: translateY(-40px);
  }
}
